<template>
  <section class="fieldWrap2" @click="showmessage">
    <div class="infoItem" v-for="item in information">
      <label class="fieldKey" :class="{'colorB_0315': item.inputs, 'shallow': !item.inputs}"><slot name="key">{{item.title}}</slot></label>
      <div class="fieldVal">
        <div class="time" :class="{'colorBlue': type == 2,'deepC': type == 3}" v-if="item.inputs == false"><slot name="value">{{item.des}}</slot></div>
        <input type="text" v-else v-model="item.des" />
      </div>
    </div>
  </section>
</template>
<script>
export default {
  props: {
    type: {
      default: 1
    },
    information:{
      default:[
        {
          title:"开始时间",
          des:"广州番禺",
          inputs:true
        }
      ]
    }
  },
  data () {
    return {
      msg:1,
    }
  },
  methods:{
    showmessage() {
      this.$emit("touchshow")
    }
  }
}
</script>
<style lang="less" scoped>
.fieldWrap2 {
  width: 100%;
  padding-left: .15rem;
  box-sizing: border-box;
  background: white;
   &:nth-last-of-type(1) {
  }
  .infoItem {
    width: 3.6rem;
    height: .42rem;
    border-bottom: .01rem solid #E5E5E5;
    display: flex;
    justify-content: space-between;
    &:nth-last-of-type(1){
      border-bottom: none;
    }
    .fieldKey {
      display: block;
      width: 1.05rem;
      height: .41rem;
      line-height: .41rem;
      font-size: .17rem;
      color: #000000;
    }
    .colorB_0315 {
      font-weight: 500;
    }
    .shallow {
      color: #828282;

    }
    .deepC {
      color: #000!important;
    }
    .fieldVal {
      width: 2.5rem;
      height: .4rem;
      line-height: .4rem;
      color: #828282;
      font-size: .17rem;
      padding-right: .15rem;
      box-sizing: border-box;
      text-align: right;
      input{
        width: 100%;
      }
      .phone_0310 {
        width: 1.26rem;
        height: .4rem;
        font-size: .17rem;
        color: #B2B2B2;
        border: none;
      }
      .time {
        width: 2.5rem;
        height: .41rem;
        line-height: .41rem;
        display:block;
        float: right;
        color: #828282;
      }
      .colorBlue {
        color: #557AFF;
      }
    }
  }
}
</style>
